
<!---- 商品列表 ---->
<template>
    <div class="container">
        <b-card-new>
            <b-query-form-new ref="bForm" :data="formData" :form="dataForm.query" @search="handleSearch"></b-query-form-new>
            <b-query-table ref="bTable" :init-columns="initColumns()" :data-form="dataForm" :handleList="handleList"></b-query-table>
        </b-card-new>
    </div>
</template>
<script>
import mixinPageHeight from "@/mixinPageHeight"
export default {
    mixins:[mixinPageHeight],
    data() {
        return {
            dataForm:{
                url:"api/product/page_list",
                query:{
                    name: "", // 商品名称
                    is_index_show: "", // 是否展示首页   
                }
            },
            formData:[
                { typeCode: "input", title: "商品名称", name: "name" },
                { typeCode: "select", title: "是否展示首页", name: "is_index_show", 
                  optionData: [
                        {key: 1, value: '是'},
                        {key: 0, value: '否'},
                    ] 
                },
            ],
            handleList: [
                {
                    name: '新增商品',
                    btnCode: '26',
                    btnClick: () => this.handleLinkTo('', 0)
                }
            ],
        }
    },
    created() {},
    methods:{
        // 删除
        handleDelete(id) {
            this.$common.bconfirm("确定删除？", "提示").then(res => {
                this.$api.setting.product_del(id).then(res => {
                    this.$message.success('删除成功')
                    this.handleRefresh()
                })
            })
        },
        // 跳转
        handleLinkTo(id, showType) {
            this.$router.push({
                path: '/setting/product/detail',
                query: {
                    id: id,
                    showType
                }
            })
        },
        // 表格初始化
        initColumns() {
            return [
                { title:"商品名称", valueName:"name" },
                { title:"商品图片", width: 200, customRander: row => <el-image style="height: 100px;" src={row.head_img} preview-src-list={[row.head_img]}></el-image> },
                { title:"商品简介", valueName:"summary", isShowTip: true },
                { title:"分期金额", valueName:"instalment_amt" },
                { title:"分期数量", valueName:"instalment_no" },
                { title:"是否显示在H5", customRander: row => ['否', '是'][row.is_index_show] },
                { title:"操作", width:120, customRander: (row) => (
                    <BTableOperation list={
                        [
                            { name: '编辑', btnCode: '27', btnClick: () => this.handleLinkTo(row.id, 1)},
                            { name: '删除', btnCode: '28', btnClick: () => this.handleDelete(row.id)}
                        ]
                        }></BTableOperation>
                    ),
                }
            ]
        }
    }
}
</script>